<template>
	<view>
		<!-- 全屏加载 -->
		<cover-bulr-bg v-if="coverBulr"></cover-bulr-bg>

		<!-- 密码访问 -->
		<block v-if="protected">
			<common-pass @passTap="emitPass" :isError="isError" :getPass="getPass" :public_name="wxSet.public_name"
				:public_key="detailData.public_key" :public_step="public_step"></common-pass>
		</block>

		<view class="centem-body" v-else>
			<!-- 顶部图片 -->
			<view class="data-clerk">
				<view class="data-clerk-text">
					<view class="data-clerk-text-h">
						相濡以沫
					</view>
					<view class="data-clerk-text-w">
						山林不向四季发誓，荣枯随缘
					</view>
				</view>
				<view class="data-img">
					<image class="fengrui-img" src="../../static/down/upload.svg" mode="scaleToFill"></image>
				</view>
			</view>

			<!-- 标题 -->
			<view class="down-view-all list-li-left-h" style="margin-top: -30rpx;">
				<view class="down-view-title">
					<view class="down-view-ruan">◉</view>{{ detailData.title.rendered }}
				</view>
				<view class="down-view-title-dscr">
					{{detailData.fr_down_title}}
				</view>
			</view>

			<!-- 激励视频下载附件样式 -->
			<block v-if="isShowDown == true">
				<view class="down-view-all">
					<view class="down-user">
						<view class="down-user-img">
							<image class="fengrui-img" src="../../static/my/user.png" mode="aspectFill"></image>
						</view>
						<view class="down-user-name">
							Resource值
						</view>
					</view>
					<button class="down-btn-video" @tap="videoAD()">
						<view class="down-btn-video-icon">
							<image class="fengrui-img" src="../../static/data/ad_video.svg" mode=""></image>
						</view>
						获取附件内容
					</button>
				</view>
			</block>


			<!-- 下载附件内容 -->
			<block v-else>
				<!-- 附件下载方式为复制链接 -->
				<block v-if="detailData.fr_down_style == '0' ||  detailData.fr_down_style == ''">
					<view class="down-view-all" v-for="(item, index) in detailData.fr_down_url" :key="index">
						<view class="down-user">
							<view class="down-user-img">
								<image class="fengrui-img" src="../../static/my/user.png" mode="aspectFill"></image>
							</view>
							<view class="down-user-name">
								Resource值
							</view>
						</view>
						<view class="down-network-view">
							<text user-select="true">
								{{ code64 == ''? item : code64}}
							</text>
						</view>
						<view class="down-list-btn">
							<button class="down-btn" type="default" v-if="code64 != ''"
								@tap="tapDownUrl(item)">复制Resource值</button>
							<button class="down-btn-key" type="default"
								v-if="detailData.fr_down_key[index] != undefined ">提取码:{{ detailData.fr_down_key[index] }}</button>
						</view>
						<view class="down-list-btn-text" v-if="code64 == ''">
							<span class="que-user-red">*</span>
							长按链接手动复制
						</view>
					</view>
				</block>

				<!-- 附件下载为直接下载方式 -->
				<block v-else>
					<view class="down-view-all">
						<view class="down-user">
							<view class="down-user-img">
								<image class="fengrui-img" src="../../static/my/user.png" mode="aspectFill"></image>
							</view>
							<view class="down-user-name">
								ZIP包
							</view>
						</view>
						<view class="down-file">
							<block v-for="(item ,index) in fileIcon" :key="index">
								<view class="down_file_icon ">
									<image :src="item.img" class="fengrui-img" mode="aspectFit"></image>
								</view>
							</block>
						</view>
						<view class="down-file-txt" v-if="detailData.fr_down_format !=''">
							格 式：{{detailData.fr_down_format}}
						</view>
						<button class="down-btn-video" @tap="downFile()" :loading="btnFile">
							{{ percentDown }}
						</button>
					</view>
				</block>

			</block>

			<!-- 判断微信流量主 -->
			<!-- #ifdef MP-WEIXIN -->
			<block v-if="wxSet.wx_video != ''">
				<view class="" style="margin: 30rpx 30rpx;">
					<ad :unit-id="wxSet.wx_video" ad-type="video" ad-theme="white"></ad>
				</view>
			</block>

			<!-- 其他平台 -->
			<view class="down-view-all">
				<view class="titel-h">
					其他平台
				</view>
				<view class="down-li-toew">
					<button class="down-icon-list-btn" @tap="wxvideoTap()" v-if="detailData.wxvideo_feedid != ''">
						<view class="down-icon-list-img">
							<image class="fengrui-img" src="../../static/data/wx_video_icon.svg" mode="aspectFit">
							</image>
						</view>
						<view class="down-icon-list-img-title">
							视频说明
						</view>
					</button>
					<button class="down-icon-list-btn" open-type="contact" :send-message-title="posdCenterTitle"
						:send-message-path="posUrl" show-message-card="true">
						<view class="down-icon-list-img">
							<image class="fengrui-img" src="../../static/my/customer.svg" mode="aspectFit">
							</image>
						</view>
						<view class="down-icon-list-img-title">
							客服
						</view>
					</button>

					<button class="down-icon-list-btn" open-type="share">
						<view class="down-icon-list-img">
							<image class="fengrui-img" src="../../static/data/share.svg" mode="aspectFit">
							</image>
						</view>
						<view class="down-icon-list-img-title">分享</view>
					</button>
				</view>
			</view>
			<!-- #endif -->

			<view class="" style="margin: 38rpx;">
				<view class="titel-h">
					声明：
				</view>
				<view class="data-clerk-text-w" style="margin: 30rpx 0rpx;">
					尊重各网络文件的版权问题，部分软件文件均出自网络，提供下载的软件和资源均为软件或程序作者提供和网友推荐收集整理而来，仅供学习和研究使用。如有侵犯你的版权，请及时通知我们，将立即改正
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	// 获取应用实例
	const app = getApp()
	import * as API from "../../utils/api";
	let rewardedVideoAd = null;
	export default {
		data() {
			return {
				// 文章ID
				posdCenterID: '',
				// 页面路径
				posUrl: '',
				// 基本配置
				wxSet: [],
				launchScene: 0, //微信小程序场景值
				// 文章详情
				detailData: [],
				// 是否显示内容
				isShowDown: true,
				// 直接下载附件
				fileIcon: [{
						img: '../../static/down/apk.svg'
					},
					{
						img: '../../static/down/Excel.svg'
					},
					{
						img: '../../static/down/PPT.svg'
					},
					{
						img: '../../static/down/Word.svg'
					},
					{
						img: '../../static/down/PDF.svg'
					},
					{
						img: '../../static/down/txt.svg'
					},
					{
						img: '../../static/down/zip.svg'
					}
				],
				percentDown: '点击下载附件',
				btnFile: false,
				coverBulr: true,

				// 随机数码
				code64: '',

				// 密码访问
				protected: false,
				isError: 'suss',
				getPass: '',
				public_step: false,
			}
		},
		// 分享好友配置
		onLoad(posID) {
			// 获取当前时间戳
			const now = new Date();
			const year = now.getFullYear();
			const month = now.getMonth() + 1; // 月份从 0 开始，需加 1
			const day = now.getDate();
			const postDaySum = year + month + day;
			this.postDaySum = postDaySum;

			// 接受数据
			this.posdCenterID = posID.id;
			// 接受数据
			this.posUrl = 'pages/download/download?id=' + posID.id;

			if (app.globalData.wxSet == '') {
				//（解决异步）
				app.on('wxSet', this.changeToken.bind(this));
			} else {
				this.wxSet = app.globalData.wxSet;
				this.launchScene = app.globalData.launchScene; //微信小程序场景值
				// 文章数据
				this.posdData();
			}


			// 微信分享盆友圈
			wx.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			})

			// 加载ing
			uni.showLoading({
				title: '加载中...'
			})
		},
		onShareAppMessage(res) {
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: this.detailData.title.rendered,
				imageUrl: this.detailData.thumbnailurl,
				path: '/pages/download/download?id=' + this.posdCenterID
			}
		},
		// 文章分享盆友圈 目前支持安卓
		onShareTimeline(res) {
			return {
				title: this.detailData.title.rendered,
				imageUrl: that.detailData.thumbnailurl,
				path: '/pages/download/download?id=' + this.posdCenterID
			}

		},

		methods: {
			//（解决异步）
			changeToken() {
				this.wxSet = app.globalData.wxSet;
				this.launchScene = app.globalData.launchScene; //微信小程序场景值
				// 文章数据
				this.posdData();

			},

			// 文章数据
			posdData() {
				API.getInfo([this.posdCenterID]).then((res) => {
					this.detailData = res.data;
					this.protected = res.data.content.protected; //密码访问
					this.coverBulr = false;
					if (this.wxSet.public_step != "") { //判断教程
						this.public_step = true;
					}
					if (this.protected == false) { // 广告缓存判断
						this.infoAdJudge();
					}
					this.infoPassJudge(); //密码缓存判断
				})
			},

			// 密码访问
			emitPass(pass) {
				API.getInfoPass(this.posdCenterID, pass).then((res) => {
					// console.log('文章密码详情', res.statusCode)
					if (res.statusCode != 200) {
						this.isError = 'err';
					} else {
						this.setPass(pass); //密码缓存
						this.detailData = res.data;
						this.protected = false; //密码访问
						this.infoAdJudge(); // 广告缓存判断
					}
				})
			},

			// 广告缓存判断
			infoAdJudge() {
				// 获取激励视频缓存
				const postAdKey = uni.getStorageSync('url_adkey');
				uni.hideLoading();
				if (this.wxSet.ad_time == '1') {
					if (postAdKey) { // 查找缓存数据
						const foundItem = postAdKey.find(item => item.id === this.posdCenterID)
						// console.log(foundItem, '查找缓存数据')
						if (foundItem) {
							if (foundItem.time != this.postDaySum) { // 缓存时间大于或不等于
								this.starpAd();
							} else {
								this.isShowDown = false;
							}
						} else {
							this.starpAd(); // 没有缓存 初始化广告
						}
					} else {
						this.starpAd(); // 没有缓存 初始化广告
					}
				} else {
					this.starpAd(); // 没有缓存 初始化广告
				}

				// 独立文章公告弹窗
				if (this.detailData.pos_notice != '') {
					uni.showModal({
						title: '公告',
						content: this.detailData.pos_notice,
					});
				}

				// 随机数码
				if (this.wxSet.fr_copyurl == '1') {
					this.random64();
				}
			},

			// 密码缓存判断
			infoPassJudge() {
				// 获取激励视频缓存
				const passKey = uni.getStorageSync('pass_adkey');
				// 查找缓存数据
				if (passKey) {
					const foundItem = passKey.find(item => item.id === this.posdCenterID)
					// console.log(foundItem,'查找缓存数据')
					if (foundItem) {
						if (foundItem.time == this.postDaySum) { // 缓存时间大于或等于
							// console.log(foundItem.pass,'缓存密码')
							this.getPass = foundItem.pass;
						}
					}
				}
			},

			// 初始化广告
			starpAd() {
				if (this.wxSet.wx_jili_video != '' && this.detailData.if_rec_down_video == '1') {
					this.CreateAd();
				} else {
					this.isShowDown = false;
				}
			},

			//初始化激励视频广告组件
			CreateAd() {
				if (this.wxSet.wx_jili_video != '') {
					if (wx.createRewardedVideoAd) {
						this.videoAd = wx.createRewardedVideoAd({
							adUnitId: this.wxSet.wx_jili_video
						})
						this.videoAd.onLoad(() => {})
						this.videoAd.onError((err) => {
							// console.log(err)
							// 播放错误下发奖励
							this.isShowDown = false;
						})
						this.videoAd.onClose((res) => {
							if (res && res.isEnded) {
								uni.showToast({
									icon: 'none',
									title: "感谢您的支持"
								})
								this.isShowDown = false;

								// 设置广告缓存
								if (this.wxSet.ad_time == '1') {
									this.setRead();
								}
							} else {
								uni.showToast({
									icon: 'none',
									title: "中途关闭广告"
								})
							}
						})
					}

				}
			},

			// 流量主视频弹窗
			videoAD() {
				if (this.launchScene == 1154) {
					uni.showToast({
						title: '请前往小程序使用完整服务',
						icon: "none"
					})
					return;
				}
				this.getVideoAd();
			},

			// 激励视频
			getVideoAd() {
				// 用户触发广告后，显示激励视频广告
				if (this.videoAd) {
					this.videoAd.show().catch(() => {
						// 失败重试
						this.videoAd.load()
							.then(() => this.videoAd.show())
							.catch(err => {
								console.log('激励视频', err)
								// this.isShowDown = false;
							})
					})
				}
			},

			// 视频号点击
			wxvideoTap() {
				uni.openChannelsActivity({
					finderUserName: this.detailData.wxvideo_id,
					feedId: this.detailData.wxvideo_feedid,
				})
			},
			// 设置广告缓存
			setRead() {
				var urlAdKey = uni.getStorageSync('url_adkey');
				if (urlAdKey == '') {
					var urlAdKey = [];
				}

				// 检测事否存在ID
				var isItem = urlAdKey.find(item => item.id === this.posdCenterID);
				// 如果有更新ID,若没有新增ID
				if (isItem) {
					const updateData = (id, newData) => {
						urlAdKey = urlAdKey.map(item => {
							if (item.id === id) {
								return {
									...item,
									...newData
								};
							}
							return item;
						});
					};
					updateData(this.posdCenterID, {
						time: this.postDaySum,
					});
				} else {
					var jlis = urlAdKey.unshift({
						id: this.posdCenterID,
						time: this.postDaySum,
					})
				}
				uni.setStorageSync('url_adkey', urlAdKey);
				// console.log(urlAdKey)
			},

			// 设置密码缓存
			setPass(e) {
				var passKey = uni.getStorageSync('pass_adkey');
				if (passKey == '') {
					var passKey = [];
				}

				// 检测事否存在ID
				var isItem = passKey.find(item => item.id === this.posdCenterID);
				// 如果有更新ID,若没有新增ID
				if (isItem) {
					const updateData = (id, newData) => {
						passKey = passKey.map(item => {
							if (item.id === id) {
								return {
									...item,
									...newData
								};
							}
							return item;
						});
					};
					updateData(this.posdCenterID, {
						time: this.postDaySum,
					});
				} else {
					var jlis = passKey.unshift({
						id: this.posdCenterID,
						time: this.postDaySum,
						pass: e,
					})
				}
				uni.setStorageSync('pass_adkey', passKey);
				// console.log(passKey)
			},

			// 左上角返回按钮
			tarBlack: function() {
				// 建立页面栈 如果是1则是分享打开需要返回主页，大于1则返回上一级
				var selPage = getCurrentPages();
				// console.log(selPage.length)
				if (selPage.length == 1) {
					uni.switchTab({
						url: "../index/index"
					})
				} else {
					uni.navigateBack({
						delta: 1
					});
				}
			},

			// 点击下载附件
			downFile() {
				this.percentDown = '下载中';
				this.btnFile = true;
				// console.log(that.detailData.fr_down_title + '.' + that.detailData.fr_down_format)
				uni.downloadFile({
					url: this.detailData.fr_down_file,
					success: (res) => {
						// console.log(res)
						if (res.statusCode == 200) {
							this.percentDown = '附件下载完成';
							this.btnFile = false;
							uni.showModal({
								title: '下载成功',
								content: '文件以下载完成仅保存一次，请使用转发功能发送到文件管理/我的电脑',
								success: (frs) => {
									if (frs.confirm) {
										uni.shareFileMessage({
											filePath: res.tempFilePath,
											fileName: this.detailData.fr_down_title + '.' +
												this.detailData.fr_down_format,
											success(data) {
												// console.log('转发ok')
											},
										})
									}
								}
							});
						} else {
							this.btnFile = false;
							this.percentDown = '附件下载失败';
							uni.showModal({
								title: '错误403',
								content: '附件下载失败',
								success: (frs) => {

								}
							})
						}
					},
				});
			},

			// 随机数码
			random64() {
				let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
				let randomString = '';
				for (let i = 0; i < 64; i++) {
					let randomIndex = Math.floor(Math.random() * characters.length);
					randomString += characters.charAt(randomIndex);
				}
				this.code64 = randomString;
				// console.log('随机吗', randomString)
			},

			// 复制Url
			tapDownUrl(e) {
				uni.setClipboardData({
					data: e,
				})
			}
		}
	}
</script>

<style>
	/* 关注微信公众号 */
	.que-user-red {
		color: red;
	}

	.account-aout {
		margin-left: 30rpx;
	}

	.account-btn {
		height: 60rpx;
		background-color: #1c262a;
		border-radius: 200rpx;
		font-size: 24rpx;
		width: 150rpx;
		color: #FFFFFF;
		flex-shrink: 0;
		margin-right: 0rpx;
	}

	.account-describe {
		font-size: 20rpx;
		color: #7c7c7c;
	}

	.account-img {
		height: 80rpx;
		width: 80rpx;
		border-radius: 200rpx;
		overflow: hidden;
	}

	.account-flex {
		display: flex;
	}

	.account-view {
		background-color: #f9f9f9;
		border-radius: 20rpx;
		height: 120rpx;
		margin: 30rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 18rpx 30rpx;
	}

	/* 密码访问 */
	.password-title {
		margin: 20rpx 0;
		font-weight: bold;
		font-size: 36rpx;
		text-align: center;
	}

	.password-desrc {
		width: 70%;
		margin: auto;
		text-align: center;
		font-size: 28rpx;
		color: #929292;
	}

	.password-position {
		position: fixed;
		top: 50%;
		left: 50%;
		width: 100%;
		transform: translate(-50%, -60%);
	}

	.password-icon {
		height: 500rpx;
		width: 100%;
		overflow: hidden;
	}

	/* 加载动画 */
	.data-login {
		height: 70rpx;
		width: 70rpx;
		margin: auto;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.data-login-flex {
		position: fixed;
		top: 0%;
		left: 0%;
		height: 100%;
		width: 100%;
		z-index: 1030;
		background-color: #f7f7f7;
	}

	.down-view-ruan {
		color: #23c1aa;
		margin-right: 14rpx;
		flex-shrink: 0;
	}

	.down-view-title {
		display: flex;
	}

	.down-view-title-dscr {
		padding: 14rpx 36rpx 30rpx 46rpx;
		color: #B2B2B2;
		font-size: 24rpx;
	}

	.down-icon-list-btn {
		text-align: center;
		margin: 0;
		background-color: unset;
		padding: 0;
	}

	.down-li-toew {
		display: flex;
		margin-top: 60rpx;
		align-items: center;
		border-radius: 20rpx;
		justify-content: space-around;
	}

	.down-icon-list {
		text-align: center;
	}

	.down-icon-list-img {
		height: 60rpx;
		width: 60rpx;
		overflow: hidden;
		margin: auto;
	}

	.down-icon-list-img-title {
		font-size: 22rpx;
		color: #b1b1b1;
		margin-top: 12rpx;
	}

	.down-li-toew-ma {
		margin: 40rpx 0rpx 20rpx 0rpx;
	}

	/* 说明 */
	.que-user-red {
		color: red;
	}

	.list-btn {
		height: 50rpx;
		width: 160rpx;
		background-color: #007AFF;
		border-radius: 100rpx;
		text-align: center;
		color: #FFFFFF;
		line-height: 50rpx;
		bottom: 0rpx;
		position: absolute;
		right: 0;
	}

	/* 列表 */
	.list-li-left-describe {
		color: #D5D5D5;
		font-size: 26rpx;
		position: absolute;
		top: 0rpx;
		left: 0rpx;
	}

	.list-li-tag {
		color: #0BBDA6;
		font-size: 20rpx;
	}

	.list-li-left-h {
		font-size: 36rpx;
	}

	.list-li-left {
		margin-left: 32rpx;
		flex-grow: 1;
		height: 120rpx;
		position: relative;
	}

	.list-img {
		height: 120rpx;
		width: 140rpx;
		border-radius: 14rpx;
		overflow: hidden;
		flex-shrink: 0;
	}

	.list-li {
		display: flex;
		margin-top: 60rpx;
		align-items: center;
		background-color: #fff;
		/* padding: 24rpx; */
		border-radius: 20rpx;
	}

	/* 百度网盘下载 */
	.down-btn {
		background-color: #007AFF !important;
		color: #FFFFFF !important;
		border-radius: 100rpx !important;
		width: 100%;
		margin: 0rpx 10rpx;
		font-size: 28rpx;
		line-height: 80rpx;
		height: 80rpx;
	}

	.down-btn-video {
		background-color: #007AFF !important;
		color: #FFFFFF !important;
		border-radius: 100rpx !important;
		width: 80%;
		margin: auto;
		font-size: 28rpx;
		line-height: 80rpx;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 60rpx;
	}

	.down-btn-video-icon {
		height: 46rpx;
		width: 56rpx;
		margin-top: -6rpx;
		margin-right: 8rpx;
	}

	.down-btn-key {
		background-color: #23c1aa !important;
		color: #FFFFFF !important;
		border-radius: 100rpx !important;
		width: 100%;
		margin: 0rpx 10rpx;
		font-size: 28rpx;
		line-height: 80rpx;
		height: 80rpx;
	}

	.down-list-btn-text {
		font-size: 22rpx;
		color: #B2B2B2;
	}

	.down-list-btn {
		display: flex;
		align-items: center;
		margin-bottom: 10rpx;
		margin-top: 22rpx;
		overflow: hidden;
	}

	.down-network-icon {
		width: 150rpx;
		background-color: #EFEFEF;
		border-radius: 10rpx;
		height: 130rpx;
		margin-left: 20rpx;
		overflow: hidden;
		flex-shrink: 0;
		line-height: 130rpx;
		margin: auto;
	}

	.down-network-view {
		padding: 30rpx 0rpx;
		background-color: #EFEFEF;
		border-radius: 10rpx;
		padding: 30rpx;
		color: #B2B2B2;
		font-size: 24rpx;
		word-break: break-all;
	}

	.down-user-name {
		margin-left: 20rpx;
		font-size: 32rpx;
	}

	.down-user-img {
		height: 60rpx;
		width: 60rpx;
		overflow: hidden;
		border-radius: 200rpx;
	}

	.down-user {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
		justify-content: flex-start;
		overflow: hidden;
	}

	.down-file {
		display: flex;
		justify-content: space-around;
		align-items: center;
		margin: 70rpx 0;
	}

	.down_file_icon {
		height: 44rpx;
		width: 44rpx;
		opacity: 0.5;
		overflow: hidden;
	}

	.down_file_icon_index {
		height: 80rpx;
		width: 80rpx;
		opacity: 1;
		overflow: hidden;
	}

	.down-file-txt {
		margin: 14rpx 0;
		font-size: 28rpx;
		color: #B2B2B2;
	}

	.self-user-updata {
		width: 50rpx;
		height: 50rpx;
		position: absolute;
		right: 76rpx;
	}

	/* 顶部图片 */
	.data-clerk-text-w {
		font-size: 24rpx;
		color: #b1b1b1;
	}

	.data-clerk-text-h {
		font-size: 40rpx;
		margin-bottom: 20rpx;
	}

	.data-clerk-text {
		width: 360rpx;
		position: absolute;
		top: 80rpx;
		left: 40rpx;
	}

	.data-clerk {
		width: 100%;
		height: 300rpx;
		position: relative;
	}

	.data-img {
		height: 300rpx;
		width: 360rpx;
		overflow: hidden;
		position: absolute;
		bottom: 0rpx;
		right: 0rpx;
	}

	/* 全局 */
	.titel-h {
		font-size: 34rpx;
		position: relative;
		margin-bottom: 10rpx;
	}

	/* .titel-h:after {
		content: '';
		position: absolute;
		bottom: -14rpx;
		left: 0px;
		width: 96rpx;
		height: 8rpx;
		border-radius: 200rpx;
		background: linear-gradient(90deg, rgba(55, 110, 234, 1) 0%, rgba(255, 255, 255, 1) 100%);
	} */

	.down-view-all {
		background-color: #FFFFFF;
		border-radius: 20rpx;
		padding: 38rpx;
		margin: 38rpx;
	}

	.fengrui-img {
		height: 100%;
		width: 100%;
	}

	page {
		background-color: #F7F7F7;
	}

	.centem-body {
		/* background-image: linear-gradient(#3482e2, #F7F7F7); */
	}

	button:after {
		border: 0px solid rgba(0, 0, 0, .2);

	}

	/* 暗黑模式下应用的样式 */
	@media (prefers-color-scheme: dark) {

		page,
		.data-login-flex {
			background: #161616;
		}

		.down-view-all,
		.account-view,
		.list-li {
			background-color: #202020;
		}

		.down-network-view,
		.account-btn,
		.down-network-icon {
			background-color: #797979;
		}
	}
</style>